<template>
	<view class="uni-container">
		<uni-forms ref="form" :model="formData" validateTrigger="bind">
			<uni-forms-item name="name" label="姓名" required>
				<uni-easyinput v-model="formData.name"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="phone" label="手机号" required>
				<uni-easyinput v-model="formData.phone"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="title" label="汽车名" required>
				<uni-easyinput v-model="formData.title"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="status" label="订单状态" required style="display: none;">
				<uni-easyinput placeholder="订单状态，0：看车预约中，1:看车预约成功 ，2：看车预约失败，3：看车预约取消，4：保养预约中，5：保养预约成功，6：保养预约失败，7：保养预约取消"
					type="number" v-model="formData.status"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="date_time" label="预约时间" required>
				<uni-easyinput v-model="formData.date_time"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item v-if="formData.status==2||formData.status==6" name="is_handle" label="是否已经处理" required>
				<uni-tag type="warning" text="预约失败"></uni-tag>
			</uni-forms-item>
			<uni-forms-item v-if="formData.status==3||formData.status==7" label="是否已经处理">
				<uni-tag type="info" text="已取消"></uni-tag>
			</uni-forms-item>
			<uni-forms-item v-if="formData.status==8" label="是否已经处理">
				<uni-tag type="success" text="已处理"></uni-tag>
			</uni-forms-item>
			<uni-forms-item v-if="formData.status==1||formData.status==5" name="is_handle" label="是否已经处理" required
				:disabled="formData.status==8">
				<switch @change="binddata('is_handle', $event.detail.value)" :checked="formData.is_handle"></switch>
			</uni-forms-item>
			<uni-forms-item v-else-if="formData.status==0||formData.status==4" name="is_aggree" label="是否接受预约" required>
				<switch @change="binddata('is_aggree', $event.detail.value)" :checked="formData.is_aggree"></switch>
			</uni-forms-item>
			<uni-forms-item name="content" label="汽车状况描述">
				<uni-easyinput v-model="formData.content"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="handle_time" label="订单完成时间" required>
				<uni-datetime-picker return-type="timestamp" v-model="formData.handle_time" :disabled="
				!(formData.status==1||formData.status==5)"></uni-datetime-picker>
			</uni-forms-item>
			<view class="uni-button-group">
				<button type="primary" class="uni-button" style="width: 100px;" @click="submit">提交</button>
				<navigator open-type="navigateBack" style="margin-left: 15px;">
					<button class="uni-button" style="width: 100px;">返回</button>
				</navigator>
			</view>
		</uni-forms>
	</view>
</template>

<script>
	import {
		validator
	} from '../../js_sdk/validator/uni-id-base-order.js';

	const db = uniCloud.database();
	const dbCmd = db.command;
	const dbCollectionName = 'uni-id-base-order';

	function getValidator(fields) {
		let result = {}
		for (let key in validator) {
			if (fields.includes(key)) {
				result[key] = validator[key]
			}
		}
		return result
	}



	export default {
		data() {
			let formData = {
				"name": null,
				"phone": "",
				"title": "",
				"status": 0,
				"date_time": "",
				"is_handle": false,
				"is_aggree": false,
				"content": "",
				"handle_time": null
			}
			return {
				formData,
				formOptions: {},
				rules: {
					...getValidator(Object.keys(formData))
				}
			}
		},
		onLoad(e) {
			if (e.id) {
				const id = e.id
				this.formDataId = id
				this.getDetail(id)
			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules)
		},
		methods: {

			/**
			 * 验证表单并提交
			 */
			submit() {
				uni.showLoading({
					mask: true
				})
				this.$refs.form.validate().then((res) => {
					return this.submitForm(res)
				}).catch(() => {}).finally(() => {
					uni.hideLoading()
				})
			},

			/**
			 * 提交表单
			 */
			submitForm(value) {
				if (value.status == 1 && value.is_handle) {
					if (this.formData.handle_time == null) {
						uni.showModal({
							content: '请选择完成时间',
							showCancel: false
						});
						return
					}
				}
				let msg
				if (value.status == 0 && value.is_aggree) {
					value.status = 1
					msg = '确定要接受预约吗'
				} else if (value.status == 0 && !value.is_aggree) {
					value.status = 2
					value.is_handle = true
					msg = '确定要拒绝预约吗'
				} else if (value.status == 1 && value.is_handle) {
					value.status = 4
					value.is_handle = true
					msg = '确定处理完成吗'
				} else if (value.status == 1 && !value.is_handle) {
					msg = '您确定修改吗'
					uni.showToast({
						title: "订单未完成不允许提交！",
						mask: true,
						icon: 'error'
					})
					return
				}
				uni.showModal({
					content: msg,
					showCancel: true,
					success: (res) => {
						if (res.confirm) {
							// 使用 clientDB 提交数据
							return db.collection(dbCollectionName).doc(this.formDataId).update(value).then((
								res) => {
								uni.showToast({
									title: '修改成功'
								})
								this.getOpenerEventChannel().emit('refreshData')
								setTimeout(() => uni.navigateBack(), 500)
							}).catch((err) => {
								uni.showModal({
									content: err.message || '请求服务失败',
									showCancel: false
								})
							})
						}
					}
				});

			},

			/**
			 * 获取表单数据
			 * @param {Object} id
			 */
			getDetail(id) {
				uni.showLoading({
					mask: true
				})
				db.collection(dbCollectionName).doc(id).field(
					"name,phone,title,status,date_time,is_handle,is_aggree,content,handle_time").get().then((res) => {
					const data = res.result.data[0]
					if (data) {
						this.formData = data

					}
				}).catch((err) => {
					uni.showModal({
						content: err.message || '请求服务失败',
						showCancel: false
					})
				}).finally(() => {
					uni.hideLoading()
				})
			}
		}
	}
</script>